<template>
  <div class="page-container">
	<!--工具栏-->
	<div class="toolbar" style="float:left;padding-top:10px;padding-left:15px;">
		<el-form :inline="true" :size="size">
			<el-form-item>
				<el-select v-model="requestParams.namespaceId" :size="size" clearable placeholder="选择命名空间"
				@change="categorySelected" @clear="categoryClear">
					<el-option
					v-for="item in namespacies"
					:key="item.id"
					:label="item.name"
					:value="item.id">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-input v-model="requestParams.name" placeholder="应用名称"></el-input>
			</el-form-item>
			<el-form-item>
				<kt-button icon="fa fa-search" :label="$t('action.search')" perms="sys:myapp:view" type="primary" 
				@click="findPage"/>
				<kt-button icon="fa fa-refresh" :label="$t('action.refresh')" perms="sys:myapp:view" type="primary" 
				@click="refresh" />
			</el-form-item>
		</el-form>
	</div>
	<kt-simple-card :appData="pageResult" :delete-ok="findPage" permsDelete="sys:myapp:delete"></kt-simple-card>
  </div>
</template>

<script>
import PopupTreeInput from "@/components/PopupTreeInput"
import KtTable from "@/views/Core/KtTable"
import KtButton from "@/views/Core/KtButton"
import KtSimpleCard from "@/views/Core/KtSimpleCard"
import TableColumnFilterDialog from "@/views/Core/TableColumnFilterDialog"
import { format } from "@/utils/datetime"
export default {
	components:{
		PopupTreeInput,
		KtTable,
		KtButton,
		TableColumnFilterDialog,
		KtSimpleCard
	},
	data() {
		return {
			size: 'small',
			requestParams: {name: '', namespaceId: ''},
			pageResult: [],
			namespacies: [],
			editLoading: false,
		}
	},
	methods: {
		categorySelected(val) {
			if(val) {
				console.log(val);
			}
		},
		categoryClear() {
			console.log("clear");
		},
		// 刷新数据
		refresh() {
			this.requestParams.name = '';
			this.requestParams.namespaceId = '';
			this.findPage();
		},
		// 获取数据
		findPage: function (data) {
			this.editLoading = true
			this.$api.apps.findMyApp(this.requestParams).then((res) => {
				console.log(res);
				this.editLoading = false
				if(res.code == 200) {
					this.pageResult = res.data
				} else {
					this.$message({message: '操作失败, ' + res.msg, type: 'error'})
				}
			}).then(data!=null?data.callback:'')
		},
		findNamespacies(){
			this.$api.namespace.findByAdminId().then((res) => {
				if(res.code == 200) {
					this.namespacies = res.data
				} else {
					this.$message({message: '操作失败, ' + res.msg, type: 'error'})
				}
			})
		},
	},
	mounted() {
		this.findPage();
		this.findNamespacies();
	}
}
</script>

<style scoped>
</style>